<html>
<head>
    <meta charset="utf-8">
    <title>客户端示例</title>
    <script type="text/javascript" src="./jquery-3.1.1.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        var bearer = "Bearer";
        var host = "http://localhost:9000/";

        // 获得版本号
        $.get(host, function(data){
            $("#ver").text(data.version);
        },"json");

        // 获取用户登录提交的用户名和密码提交到后端进行登录验证
        // 本地存储后建议设定过期时间，本例忽略~
        // 不需要每次都执行登录认证操作，仅当本地认证信息过期时进行登录认证~
        if (!window.localStorage.getItem("Authorization")) {
            $.ajax({
                url: host + "signin/",
                type:"POST",
                data:{
                    username:"insion",
                    password:"PaSsworD"
                },
                success:function(data){
                    var authorization = bearer + " " + data.token;
                    window.localStorage.setItem("Authorization", authorization);
                }
            });
        }

        // 每次动作附带认证头部
        $.ajaxSetup({
            type: "GET,POST",
            beforeSend: function (xhr) {
            xhr.setRequestHeader("Authorization", window.localStorage.getItem("Authorization"));
            }
        });

        // 更新token
        $(document).ajaxSuccess(function(event,xhr,options){
            var authorization = xhr.getResponseHeader('Authorization');
            if(authorization){
                window.localStorage.setItem('Authorization', authorization);
                console.log(authorization);
                $("#authorization").text(authorization);
            }
        });

        // 权限操作
        $.ajax({
            url: host + "jwt/get/",
            type: "GET",
            success: function(data, status, xhr) {
                $("#claim").text(data.value);
                console.log(xhr.getAllResponseHeaders());
            },
            error: function (xhr, textStatus, errorThrow) {
                    console.log(xhr.readyState);
            }
        });

    });

    </script>
</head>
<body>
    <h1><div id="ver"></div></h1>
    <h3><div id="claim"></div></h3>
    <h3><div id="authorization"></div></h3>
</body>
</html>